import { useState,useEffect } from "react"

function ChangeTheme(){
     const isDarkMode = window.matchMedia("(prefers-color-scheme: dark)").matches;
    const [localTheme,setLocalTheme] =useState(isDarkMode?'dark':'')

    useEffect(()=>{
       
        document.querySelector('html').className =  localTheme//classList.add(
    },
    [localTheme]
    )

    return (
        <button type="button" onClick={()=>{
            setLocalTheme(localTheme==='dark'? '' :'dark')
            
        }}>切换主题 {localTheme? '暗黑':'白天'}</button>
    )
}
export default ChangeTheme